Skip to content

[TreeView] Add visual progress indicators to domain tiles #4024

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Draft
wants to merge 13 commits into
base: master
Choose a base branch
from
Draft

[TreeView] Add visual progress indicators to domain tiles #4024

wants to merge 13 commits into from

Conversation

Copy link
Contributor

Copilot AI commented Nov 10, 2025 •
edited
Loading

Adds progress metrics to semantic domain tiles: sense count badges on the current domain and completion progress bars on navigable siblings/children.

Backend

Added two statistics endpoints in StatisticsController:

  • GetDomainSenseCount(projectId, domainId) - returns count of senses tagged with domain
  • GetDomainProgressProportion(projectId, domainId, lang) - returns ratio of descendant domains with entries (0.0-1.0)

Efficient MongoDB Query: Added CountSensesWithDomain method to WordRepository that performs targeted database queries instead of fetching the entire Frontier. Includes optional maxCount parameter for early-exit optimization when checking for existence.

Service implementation efficiently computes descendants via string prefix matching on domain IDs with proper validation to prevent index-out-of-range exceptions.

Frontend

CurrentRow: Badge displays sense count in upper corner with tooltip "Number of words gathered in this domain"

DomainTileButton: Progress bar along bottom edge shows descendant domain completion percentage. Only shown for Down/Prev/Next directions (excludes parent Up tile per spec).

// CurrentRow badge
{senseCount !== undefined && senseCount > 0 && (
  <Tooltip title={t("treeView.senseCountTooltip")}>
    <Badge badgeContent={senseCount} color="secondary" />
  </Tooltip>
)}

// DomainTileButton progress bar
{shouldShowProgress && progressProportion !== undefined && (
  <Box sx={{ width: `${progressProportion * 100}%`, backgroundColor: theme.palette.primary.main }} />
)}

API Integration: Backend functions in src/backend/index.ts automatically retrieve project ID using LocalStorage.getProjectId(), following the pattern of other functions in that file. API calls use error handling with graceful degradation - failed fetches simply don't render indicators.

Translations: English translation added in public/locales/en/translation.json. Other languages handled via Crowdin.

Original prompt

This section details on the original issue you should resolve

<issue_title>[TreeView] Add visual progress indicators to domain tiles</issue_title>
<issue_description>On the center/current tile (src/components/TreeView/TreeDepiction/CurrentRow.tsx):

  • Small circle in an upper corner with a number of senses with that domain
    • Hover text: "Number of words gathered in this domain"
    • Add function to Backend\Controllers\StatisticsController.cs for getting that number

On the sibling and children tiles (src/components/TreeView/TreeDepiction/DomainTileButton.tsx):

  • Not on the parent tile (so only for Direction.Down, .Prev, .Next)
  • A thin progress bar along the bottom edge showing proportion of descendent domains that have at least one entry
    • Same color as the border
    • Empty will just look like a second line along the bottom, with a very narrow gap between it at the bottom border
    • Full will just look like a thick bottom border
    • Add function to Backend\Controllers\StatisticsController.cs for getting that proportion
      </issue_description>

<agent_instructions>Follow the instruction in #3969</agent_instructions>

Comments on the Issue (you are @copilot in this section)

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

This change is Reviewable

Copilot AI changed the title [WIP] Add visual progress indicators to domain tiles Add visual progress indicators to domain tiles in TreeView Nov 10, 2025
Copilot AI requested a review from imnasnainaec November 10, 2025 17:54
Copilot finished work on behalf of imnasnainaec November 10, 2025 17:54
imnasnainaec
imnasnainaec requested changes Nov 10, 2025
View reviewed changes
Copy link
Collaborator

@imnasnainaec imnasnainaec left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot

@imnasnainaec imnasnainaec changed the title Add visual progress indicators to domain tiles in TreeView [TreeView] Add visual progress indicators to domain tiles Nov 10, 2025
Copilot AI changed the title [TreeView] Add visual progress indicators to domain tiles Add visual progress indicators to domain tiles in TreeView Nov 10, 2025
Copilot AI requested a review from imnasnainaec November 10, 2025 19:04
Copilot finished work on behalf of imnasnainaec November 10, 2025 19:04
@github-actions
Copy link

github-actions bot commented Nov 10, 2025 •
edited
Loading

⚠️ Commit Message Format Issues ⚠️
commit 24af9473ef:
1: T1 Title exceeds max length (79>72): "Add backend statistics endpoints for domain sense count and progress proportion"

@codecov
Copy link

codecov bot commented Nov 10, 2025 •
edited
Loading

Codecov Report

❌ Patch coverage is 48.27586% with 30 lines in your changes missing coverage. Please review.
✅ Project coverage is 74.52%. Comparing base (a49f082) to head (ad395e4).

Files with missing lines Patch % Lines
Backend/Services/StatisticsService.cs 0.00% 28 Missing ⚠️
...c/components/TreeView/TreeDepiction/CurrentRow.tsx 85.71% 1 Missing ⚠️
...onents/TreeView/TreeDepiction/DomainTileButton.tsx 88.88% 1 Missing ⚠️
Additional details and impacted files 
@@            Coverage Diff             @@
##           master    #4024      +/-   ##
==========================================
- Coverage   74.66%   74.52%   -0.15%     
==========================================
  Files         293      293              
  Lines       10890    10947      +57     
  Branches     1364     1373       +9     
==========================================
+ Hits         8131     8158      +27     
- Misses       2362     2392      +30     
  Partials      397      397
Flag Coverage Δ
backend 85.20% <33.33%> (-0.46%) ⬇️
frontend 66.16% <87.50%> (+0.05%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@imnasnainaec imnasnainaec changed the title Add visual progress indicators to domain tiles in TreeView [TreeView] Add visual progress indicators to domain tiles Nov 10, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@imnasnainaec imnasnainaec Awaiting requested review from imnasnainaec

Requested changes must be addressed to merge this pull request.

Assignees

@imnasnainaec imnasnainaec

Copilot code review Copilot

Labels

backend component: TreeView frontend project test

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[TreeView] Add visual progress indicators to domain tiles

2 participants

@imnasnainaec